body {
  background-color: #000;
  margin: 0;
  height: 3000px;
}

/* 边框 */
#A13 .chip {
  fill: #fff
}

#A13 .text-bg {
  fill: #fff;
}

#A13 .chip-mask {
  fill: #000;
}

#chip-section {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

video {
  height: 100vh;
  width: auto;
  /* 视频居中 */
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
}

#the-chip {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100px;
  height: 100px;
  /* 同时设置内层阴影和外层阴影 */
  box-shadow: 0px 0px 0px 100vw black, 0px 0px 0px 30px black inset;
  z-index: 10;
  /* 避免卷动到最顶部的时候 宽和高直接变为0 */
  min-width: 100px;
  min-height: 100px;

  /* 填补晶片的洞 */
  background-color: #000;
}

#the-chip.transparent {
  background-color: transparent;
}

#A13 {
  position: absolute;
  width: 100%;
  height: 100%;

  /* 最开始的时候不显示 */
  opacity: 0;
}

h1 {
  position: absolute;
  top: 0;
  left: 0;
  color: #fff;
  z-index: 20;
  font-family: helvetica;
  font-size: 64px;
  letter-spacing: -1px;
  /* 文字内容居中 */
  text-align: center;
  width: 100%;
  top: 50%;
  transform: translate(0, -50%);
  margin: 0;
}